package com.cc.openeye.testDialog

import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateListOf
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue
import com.cc.openeye.Button
import com.cc.openeye.base.BasePager
import com.cc.openeye.padding
import com.tencent.kuikly.compose.animation.AnimatedVisibility
import com.tencent.kuikly.compose.animation.core.tween
import com.tencent.kuikly.compose.animation.fadeIn
import com.tencent.kuikly.compose.animation.fadeOut
import com.tencent.kuikly.compose.foundation.background
import com.tencent.kuikly.compose.foundation.clickable
import com.tencent.kuikly.compose.foundation.layout.*
import com.tencent.kuikly.compose.foundation.shape.RoundedCornerShape
import com.tencent.kuikly.compose.material3.Surface
import com.tencent.kuikly.compose.material3.Text
import com.tencent.kuikly.compose.material3.TextButton
import com.tencent.kuikly.compose.setContent
import com.tencent.kuikly.compose.ui.Alignment
import com.tencent.kuikly.compose.ui.Modifier
import com.tencent.kuikly.compose.ui.graphics.Color
import com.tencent.kuikly.compose.ui.unit.dp
import com.tencent.kuikly.compose.ui.window.Dialog
import com.tencent.kuikly.core.annotations.Page
import com.tencent.kuikly.core.coroutines.delay
import com.tencent.kuikly.core.coroutines.launch
import com.tencent.kuikly.core.nvi.serialization.json.JSONObject
import com.tencent.kuikly.core.views.Text

@Page("TestDialogPage", supportInLocal = true)
class TestDialogPage : BasePager() {

    override fun onCreatePager(pagerId: String, pageData: JSONObject) {
        super.onCreatePager(pagerId, pageData)
        println("====>pagerId:${pagerId}")
    }


    @Composable
    fun AnimatedVisibilityDemo(
        visible: Boolean,
        onClick: (visible: Boolean) -> Unit,
        onFinish: () -> Unit,
        content: @Composable () -> Unit
    ) {

        Column(horizontalAlignment = Alignment.CenterHorizontally) {
            com.tencent.kuikly.compose.material3.Button(onClick = {
                onClick(!visible)
                lifecycleScope.launch {
                    delay(1100)
                    onFinish()
                }
            }) {
                Text(if (visible) "点击隐藏" else "点击显示")
            }

            Spacer(modifier = Modifier.height(8.dp))

            AnimatedVisibility(
                visible = visible,
                enter = fadeIn(animationSpec = tween(durationMillis = 1000)),
                exit = fadeOut(animationSpec = tween(durationMillis = 1000))
            ) {

                content()

            }
        }
    }

    override fun willInit() {
        super.willInit()
        setContent {

//            val testlist by remember {
//                mutableStateOf(arrayListOf(0, 1))
//            }

            val testlist = remember {
                mutableStateListOf(0, 1)
            }


            val testBoollist = remember {
                mutableStateListOf(false, false)
            }

            var visible by remember { mutableStateOf(true) }


            Box(modifier = Modifier.padding(top = pageData.statusBarHeight)) {
                pageData.nativeBuild

                testlist.forEachIndexed { index, i ->
//                    if (it == 0) {
//                        Box(
//                            modifier = Modifier.fillMaxSize(),
//                            contentAlignment = Alignment.BottomStart
//                        ) {
//                            Button {
//                                Text("test", modifier = Modifier.clickable {
//                                    testlist.removeAt(0)
//                                })
//                            }
//                        }
//                    } else {
//                        AnimatedVisibilityDemo(visible) { data->
//                            visible = data
//                        }
//
//                    }

                    AnimatedVisibilityDemo(testBoollist[index], onClick = { data ->
                        testBoollist[index] = data

                    }, onFinish = {
                        testlist.removeAt(index)
                    }) {
                        if (index == 0) {
                            Box(
                                modifier =
                                    Modifier
                                        .size(100.dp)
                                        .background(Color(0xFF2196F3)),
                                contentAlignment = Alignment.Center,
                            ) {
                                Text("内容", color = Color.White)
                            }
                        } else {

                            Box(
                                modifier =
                                    Modifier
                                        .size(100.dp)
                                        .background(Color(0xFF2196F3)),
                                contentAlignment = Alignment.BottomStart,
                            ) {
                                Text("内容", color = Color.White)
                            }
                        }
                    }


                }
            }

        }
    }

    @Composable
    fun showDialogComponent() {
        val isShowDialog by remember {
            isShow
        }

        Box(modifier = Modifier.fillMaxWidth().fillMaxHeight()) {
            if (isShowDialog) {
                Dialog(onDismissRequest = { }) {
                    composeFun?.invoke()
                }
            }
        }
    }


    @Composable
    private fun testDialog() {
        Surface(
            shape = RoundedCornerShape(16.dp),
        ) {
            Column(
                modifier = Modifier.padding(16.dp),
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
                Text("自定义对话框标题")
                Spacer(modifier = Modifier.height(16.dp))
                Text("这是完全自定义的对话框内容")
                Spacer(modifier = Modifier.height(24.dp))
                Row {
                    TextButton(onClick = {
                        cancelDialog()
                    }) {
                        Text("取消")
                    }
                    Spacer(modifier = Modifier.width(8.dp))
                    Button(onClick = {
                        cancelDialog()
                    }) {
                        Text("确定")
                    }
                }
            }
        }
    }


    companion object {

        var isShow = mutableStateOf(false)

        var composeFun: @Composable (() -> Unit)? = null

        fun openDialog(content: @Composable (() -> Unit)) {
            if (composeFun != null) return
            composeFun = content
            isShow.value = true
        }

        fun cancelDialog() {
            isShow.value = false
            composeFun = null
        }
    }
}